<template>
	<view class="page">
		<view class="top-head-bg">
			<image src="@/static/images/home-bg.png" mode=""></image>
			<view class="swiper-box">
				<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000">
					<swiper-item class="swiper-item" v-for="(item,index) in bannerArr" :key="index">
						<image :src="item.image" mode=""></image>
					</swiper-item>
				</swiper>
			</view>
		</view>

		<view class="px-3">
			<view class="nav-list flex flex-wrap justify-between mb-3">
				<view class="item-nav flex flex-column justify-center text-center align-center"
					v-for="(item,index) in navArr" :key="index" @click="navBtn(item)">
					<image class="mb-2" :src="item.icon" mode=""></image>
					<view>{{item.name}}</view>
				</view>
			</view>

			<view class="rmzx mb-3">
				<image class="rmzx-img" src="../../static/images/rmzx.png" mode=""></image>
			</view>


			<view class="content-list">
				<view class="item-content mb-3" v-for="(item,index) in news" :key="index" @click="readDetail(item.id)">
					<image :src="item.image"></image>
					<view class="text-ellipsis">{{item.name}}</view>
				</view>
			</view>
		</view>
		<u-popup :show="show" mode="center" :round="20" @close="close" @open="open">
			<view class="popup">
				<image src="https://d-youpin.bigchun.com/assets/image/img.png"></image>
				<view class="tip-1">请跳转到</view>
				<view class="tip-2">国动智充+小程序中充电</view>
				<view class="toCharge" @click="toCharge()">马上使用</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {
		postLogin,
		getUserInfo
	} from '../../api/user.js';
	import {
		wechatConfig
	} from '../../api/public.js';
	import {
		postHome,
		postUpFileUrl
	} from '../../api/home.js'
	export default {
		data() {
			return {
				show: false,
				bannerArr: [], // 轮播图
				news: [], // 新闻资讯
				key: "", // 加密key
				navArr: [{
						icon: "../../static/images/sys-nav.png",
						name: "扫一扫"
					},
					{
						icon: "../../static/images/xiaoxi-nav.png",
						name: "消息",
						link: "/pages/home/inform"
					},
					{
						icon: "../../static/images/zfzx-nav.png",
						name: "政府资讯",
						link: "/pages/home/consult"
					},
					{
						icon: "../../static/images/cdz-nav.png",
						name: "充电桩",
						link: "/pages/home/powermap"
					},
					{
						icon: "../../static/images/clgl-nav.png",
						name: "车辆管理",
						link: "/pages/home/vehicle"
					},
					{
						icon: "../../static/images/ly-nav.png",
						name: "悠品鹏城",
						link: ""
					},
					{
						icon: "../../static/images/kd.png",
						name: "宽带",
						link: "/pages/user/broadband",
						isLogin: true
					},
					{
						icon: "../../static/images/yh.png",
						name: "上传隐患",
						link: "/pages/home/danger",
						isLogin: true
					},
					{
						icon: "../../static/images/sp.png",
						name: "附近商铺",
						link: "/pages/home/shops",
						isLogin: true

					},
				]

			}
		},
		onLoad() {
			//用户没登陆的时候
			// if(!uni.getStorageSync('userInfo')) this.isWxLogin();
			// else this.getInfo();
			// var url =  location.href;
			// if (url.indexOf('phone') != -1) {
			// 	this.phone = url.split('phone=')[1];
			// 	this.isWxLogin()
			// }
			this.init();
			// #ifdef H5
			// this.getConfig();
			// #endif
		},
		onReady() {
			uni.preloadPage({
				url: "/pages/home/powermap",
			})
		},
		methods: {
			open() {
				this.show = true
			},
			close() {
				this.show = false
			},
			async init() {
				var res = await postHome()
				if (res.data.code == 1) {
					this.bannerArr = res.data.data.banner;
					this.news = res.data.data.news;
					this.key = res.data.data.key;
				}

			},
			async toCharge() { 
				console.log("/pages/index/index.html?q=https%3A%2F%2Fguodongiot.com%3F"+this.AppletJumpYoupin.replace("device_id","deviceID"));
				uni.navigateToMiniProgram({
					appId: 'wx47f5db820735a53b',
					// path: 'page/Applet/Chargingpile/AppletJumpYoupin?device_id=401271092700556&unique_id=18539426815&secret_key=84769044d40aeb5b8ea79ad633fcb394',
					path:"/pages/index/index.html?q=https%3A%2F%2Fguodongiot.com%3F"+this.AppletJumpYoupin.replace("device_id","deviceID")
					 ,success(res) {
						this.show = false;
					},
					fail(res) {
						console.log("fail", res);
					}
				})
			},
			navBtn(item) {
				if (item.name == "悠品鹏城") {
					uni.navigateTo({
						url: "/pages/home/webView?title=悠品鹏城src=" + encodeURIComponent(
							"https://youpin.youpinpc.com/app/index.php?i=2&c=entry&do=myhome&m=we7_flow"),
					})
					return
				}
				var self = this;
				if (item.name == '扫一扫') {
					if (!uni.getStorageSync('userInfo')) {
						uni.showToast({
							title: "请登录",
							icon: "none"
						})
						setTimeout(() => {
							uni.navigateTo({
								url: "/pages/user/login",
							})
						}, 1200)
						return
					}

					if (uni.getStorageSync('userInfo') && uni.getStorageSync('userInfo').mobile == '') {
						uni.showToast({
							title: "请绑定手机号",
							icon: "none"
						})
						setTimeout(() => {
							uni.navigateTo({
								url: '/pages/user/login?type=' + uni.getStorageSync('uid')
							})
						}, 1200)
						return
					}

					uni.scanCode({
						scanType: ["qrcode", "barCode"],
						success: async function(res) {
							console.log("scanCode", res.result);
							var url = res.result
							let user = uni.getStorageSync('userInfo'),
								mobile;
							if (user.mobile) mobile = user.mobile;
							let resule = await postUpFileUrl({
								url,
								mobile
							})
							console.log(resule.data.data); 
							if (resule.data.code == 1) { 
								if(resule.data.data.indexOf('guodong')!=-1){
									self.AppletJumpYoupin = encodeURIComponent(resule.data.data.split('?')[1]) 
									console.log(encodeURIComponent(self.AppletJumpYoupin));
									self.show = true
								}else if(resule.data.data.indexOf('atx')!=-1){
									uni.navigateTo({
										url: "/pages/home/webView?title=安天下&src=" + encodeURIComponent(resule.data.data),
									})
								}else {
								uni.showToast({
									title:"暂不支持",
									icon: 'none'
								})
							}
								
								 
							} else {
								uni.showToast({
									title: resule.data.msg,
									icon: 'none'
								})
							}
						}
					})
				} else if (item.name == '充电桩') {
					uni.navigateTo({
						url: item.link
					})
				} else if (item.isLogin) {
					if (!uni.getStorageSync('userInfo')) {
						uni.showToast({
							title: "请登录",
							icon: "none"
						})
						setTimeout(() => {
							uni.navigateTo({
								url: "/pages/user/login",
							})
						}, 1200)
						return
					}
					uni.navigateTo({
						url: item.link
					})
				} else {
					if (item.link) uni.navigateTo({
						url: item.link
					})
				}

			},
			getConfig() {
				var data = {
					url: encodeURIComponent(location.href.split('#')[0])
				}
				wechatConfig(data).then(res => {
					this.initJsdk(res.data.data)
				})
			},
			initJsdk(config) {
				this.$wx.config({
					debug: false, // 开启调试模式
					appId: config.appId, // 必填，公众号的唯一标识
					timestamp: config.timestamp, // 必填，生成签名的时间戳
					nonceStr: config.nonceStr, // 必填，生成签名的随机串
					signature: config.signature, // 必填，签名，见附录1
					jsApiList: config.jsApiList // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
				})
				this.$wx.ready(function() {
					this.$wx.checkJsApi({
						jsApiList: ['scanQRCode', 'getLocation'],
						success: function(res) {

						}
					})
				})
				this.$wx.error(function(res) {
					// console.log(res,'this.$wx.error')
				});

			},
			isWxLogin() {
				var url = location.href;

				var code = '';
				if (url.indexOf('code') != -1) {
					code = url.split('?')[1].split('&')[0].split('code=')[1];
				}
				if (code) {
					let data = {};
					data.code = code;
					data.phone = this.phone;
					data.is_landlord = uni.getStorageSync('isType') || 0
					postLogin(data).then(res => {
						if (res.data.code == 1) {
							uni.showToast({
								title: res.data.msg,
								icon: 'success'
							})
							if (uni.getStorageSync('isType')) uni.removeStorageSync('isType')
							uni.setStorageSync('token', res.data.data.token);
							uni.setStorageSync('uid', res.data.data.id);
							uni.setStorageSync('userInfo', res.data.data);

						} else if (res.data.code == 101) {
							var uid = res.data.data.id;
							uni.setStorageSync('token', res.data.data.token);
							uni.setStorageSync('uid', res.data.data.id);
							uni.setStorageSync('userInfo', res.data.data);
							uni.showModal({
								title: '提示',
								content: '请绑定手机号',
								confirmText: "去绑定",
								success: function(res) {
									if (res.confirm) {
										uni.navigateTo({
											url: '/pages/user/login?type=' + uid
										})
										return
									} else if (res.cancel) {

									}
								}
							});

						}
					})
				}
			},
			// 文章详情
			readDetail(id) {
				if (!uni.getStorageSync('userInfo')) {
					uni.navigateTo({
						url: "/pages/user/login",
						success() {
							uni.showToast({
								title: "请登录",
								icon: "none"
							})
						}
					})
					return
				} else {
					uni.navigateTo({
						url: "/pages/home/newDetail?id=" + id
					})
				}

			},

			getInfo() {
				var data = {
					uid: uni.getStorageSync('uid')
				}
				getUserInfo(data).then(res => {
					if (res.data.code == 1) {
						uni.setStorageSync('userInfo', res.data.data);
						uni.setStorageSync('token', res.data.data.token);
					} else {
						wx.clearStorage()
						var url = location.href;
						var code = '';
						if (url.indexOf('code') != -1) {
							code = url.split('?')[1].split('&')[0].split('code=')[1];
						}
						if (code) this.isWxLogin();
					}
				})
			},
		//发送给朋友
		onShareAppMessage(res) {
			// // 此处的distSource为分享者的部分信息，需要传递给其他人
			// let distSource = uni.getStorageSync('distSource');
			// if (distSource) {
			// 	return {
			// 		title: '欢迎使用xxx商城',
			// 		type: 0,
			// 		path: '/pages/index/index?id=' + distSource,
			// 		summary: "",
			// 		imageUrl: "https://58d.oss-cn-hangzhou.aliyuncs.com/goods/ttg_1596073788000.png"
			// 	}
			// }
		},
		//分享到朋友圈
		onShareTimeline(res) {
			// let distSource = uni.getStorageSync('distSource');
			// if (distSource) {
			// 	return {
			// 		title: '欢迎使用xxx商城',
			// 		type: 0,
			// 		query: 'id=' + distSource,
			// 		summary: "",
			// 		imageUrl: "https://58d.oss-cn-hangzhou.aliyuncs.com/goods/ttg_1596073788000.png"
			// 	}
			// }
		},
		}
	}
</script>

<style>
	page {
		background: rgb(245, 245, 245);
	}

	.popup {
		padding: 20rpx;
		display: flex;
		flex-direction: column;
		align-items: center;

	}

	.tip-1 {
		font-size: 15px;
		color: #000;
		padding: 13px 0 8px 0;
	}

	.tip-2:before {
		content: '';
		display: block;
		position: absolute;
		left: -12px;
		top: 7px;
		width: 6px;
		height: 6px;
		background: #FF002B;
		border-radius: 50%;
	}

	.tip-2 {
		font-size: 14px;
		color: #FF002B;
		padding-bottom: 16px;
		position: relative;
		line-height: 20px;
	}

	.toCharge {
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 14px;
		background-image: linear-gradient(#FF002B, #FF6565);
		width: 223px;
		height: 46px;
		border-radius: 23px;
		border: none;
		color: #fff;
	}

	.top-head-bg {
		width: 100%;
		height: 200rpx;
		position: relative;
		margin-bottom: 200rpx;
	}

	.top-head-bg image {
		width: 100%;
		height: 100%;
	}

	.swiper-box {
		width: 670rpx;
		height: 260rpx;
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		top: 57rpx;
	}

	.swiper-item,
	.swiper-item image {
		width: 100%;
		height: 100%;
	}

	.nav-list {
		background-color: white;
		padding: 20rpx 20rpx;
		border-radius: 10rpx;
		font-size: 26rpx;
		color: #333;
	}

	.item-nav {
		width: 33%;
		justify-content: center;
		align-items: center;
		margin-bottom: 20rpx;
	}

	.nav-list .item-nav:nth-child(3n+3) {
		margin-right: 0 !important;
	}

	.item-nav image {
		width: 80rpx;
		height: 80rpx;
	}

	.rmzx {
		width: 100%;
		padding: 15rpx 32rpx;
		background-color: #FFFFFF;
		box-sizing: border-box;
	}

	.rmzx-img {
		width: 105rpx;
		height: 45rpx;
	}

	.item-content {
		width: 100%;
		padding: 20rpx;
		box-sizing: border-box;
		font-size: 26rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
	}

	.item-content image {
		width: 100%;
		height: 295rpx;
		margin-bottom: 25rpx;
		border-radius: 10rpx;
	}
</style>
